import Vue from 'vue'
import Element, { MessageBox } from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import sBreadcrumb from '../components/breadcrumb'
import { getConfig, getValueByKey, getToken, setToken } from '../utils/tools'
import Storage from '../utils/storage'
import aliIcon from '../components/aliIcon'
import BaiduMap from 'vue-baidu-map'
import { flylineChartEnhanced, fullScreenContainer, borderBox7, scrollBoard, conicalColumnChart, capsuleChart, activeRingChart } from '@jiaminghi/data-view'

Vue.use(BaiduMap, {
  // ak 是在百度地图开发者平台申请的密钥 详见 http://lbsyun.baidu.com/apiconsole/key */
  ak: 'YOUR_APP_KEY'
})
Vue.use(Element, { size: 'small' })
Vue.use(flylineChartEnhanced)
Vue.use(fullScreenContainer)
Vue.use(borderBox7)
Vue.use(scrollBoard)
Vue.use(conicalColumnChart)
Vue.use(capsuleChart)
Vue.use(activeRingChart)
Vue.component('s-breadcrumb', sBreadcrumb)
Vue.component('ali-icon', aliIcon)
// 图片预览指令
Vue.directive('preview', {
  // 当被绑定的元素插入到 DOM 中时……
  inserted: function(el, binding) {
    el.addEventListener('click', () => {
      Vue.prototype.$preview(el.getAttribute('src'))
    })
  }
})

//打开预览图片方法 this.$preview(src)
Vue.prototype.$preview = src => {
  Vue.prototype.$msgbox({
    customClass: 'img-preview-box',
    dangerouslyUseHTMLString: true,
    message: `<img src='${src}' alt=""/>`,
    showConfirmButton: false,
    callback: () => {}
  })
}
//确认框窗口
Vue.prototype.$confirm = (content, onOk) => {
  MessageBox.confirm(content, {
    title: '提示',
    type: 'warning',
    callback: act => {
      if (act == 'confirm') {
        onOk()
      }
    }
  })
}
//表单提交
Vue.prototype.$submit = (obj, form, callback) => {
  let formDom = obj.$refs[form]
  formDom.validate(valid => {
    if (valid) {
      callback()
    } else {
      let errors = formDom.fields
      for (let error of errors) {
        if (error.validateState == 'error') {
          obj.$message.warning({
            message: error.validateMessage,
            duration: 2000
          })
          break
        }
      }
    }
  })
}

//公共方法调用 this.$tools.getValueByKey
Vue.prototype.$tools = {
  getConfig,
  getValueByKey,
  getToken,
  setToken
}
Vue.prototype.$storage = Storage
Vue.prototype.$config = getConfig
